آموزش ReactJS 18, Firebase 9 Project- Realtor Clone [ویدئو]

سرفصل ها و درس ها

معرفی Introduction

• معرفی Introduction

نصب و اولین قالب Installation and First Template

• ReactJS و Tailwind CSS را نصب کنید و اولین قالب را ایجاد کنید Install ReactJS and Tailwind CSS and Create the First Template

• ReactJS و Tailwind CSS را نصب کنید و اولین قالب را ایجاد کنید Install ReactJS and Tailwind CSS and Create the First Template

• ایجاد صفحات و مسیرها Create Pages and Routes

• ایجاد صفحات و مسیرها Create Pages and Routes

• کامپوننت هدر را ایجاد کنید Create the Header Component

• کامپوننت هدر را ایجاد کنید Create the Header Component

احراز هویت با استفاده از Firebase Auth نسخه 9 Authentication Using Firebase Auth Version 9

احراز هویت با استفاده از Firebase Auth نسخه 9 Authentication Using Firebase Auth Version 9

• صفحات ورود، ثبت نام و فراموشی رمز عبور و مؤلفه OAuth را ایجاد کنید Create Sign In, Sign Up, and Forgot Password Pages and OAuth Component

• صفحات ورود، ثبت نام و فراموشی رمز عبور و مؤلفه OAuth را ایجاد کنید Create Sign In, Sign Up, and Forgot Password Pages and OAuth Component

• Firebase را نصب کنید و react-toastify کنید و کاربر را ثبت نام کنید Install Firebase and react-toastify and Sign Up the User

• Firebase را نصب کنید و react-toastify کنید و کاربر را ثبت نام کنید Install Firebase and react-toastify and Sign Up the User

• عملکرد OAuth را کامل کنید Complete the OAuth Functionality

• عملکرد OAuth را کامل کنید Complete the OAuth Functionality

• عملکرد ورود به سیستم را کامل کنید Complete the Sign-In Functionality

• عملکرد ورود به سیستم را کامل کنید Complete the Sign-In Functionality

• عملکرد صفحه رمز فراموش شده را کامل کنید Complete the Forgot Password Page Functionality

• عملکرد صفحه رمز فراموش شده را کامل کنید Complete the Forgot Password Page Functionality

صفحه نمایه Profile Page

صفحه نمایه Profile Page

• مسیر خصوصی برای محافظت از صفحه نمایه و عملکرد خروج ایجاد کنید Create Private Route for Protecting the Profile Page and Logout Functionality

• مسیر خصوصی برای محافظت از صفحه نمایه و عملکرد خروج ایجاد کنید Create Private Route for Protecting the Profile Page and Logout Functionality

• قابلیت ویرایش را به صفحه نمایه اضافه کنید Add the Edit Functionality to the Profile Page

• قابلیت ویرایش را به صفحه نمایه اضافه کنید Add the Edit Functionality to the Profile Page

• کامپوننت هدر را کامل کنید و آن را پویا کنید Complete the Header Component and Make It Dynamic

• کامپوننت هدر را کامل کنید و آن را پویا کنید Complete the Header Component and Make It Dynamic

• کامپوننت اسپینر را ایجاد کنید Create the Spinner Component

• کامپوننت اسپینر را ایجاد کنید Create the Spinner Component

• ایجاد رابط کاربری صفحه فهرست ایجاد کنید Create the Create Listing Page UI

• ایجاد رابط کاربری صفحه فهرست ایجاد کنید Create the Create Listing Page UI

• قابلیت های onchange و onsubmit را به صفحه ایجاد فهرست اضافه کنید Add Functionality of onchange and onsubmit Functions to the Create Listing Page

• قابلیت های onchange و onsubmit را به صفحه ایجاد فهرست اضافه کنید Add Functionality of onchange and onsubmit Functions to the Create Listing Page

• بخش لیست های من را به صفحه نمایه اضافه کنید و جزء listingItem را ایجاد کنید Add My Listings Section to the Profile Page and Create the listingItem Component

• بخش لیست های من را به صفحه نمایه اضافه کنید و جزء listingItem را ایجاد کنید Add My Listings Section to the Profile Page and Create the listingItem Component

• کامپوننت listingItem را کامل کنید Complete the listingItem Component

• کامپوننت listingItem را کامل کنید Complete the listingItem Component

• قابلیت حذف و ویرایش را به بخش فهرست من اضافه کنید Add Delete and Edit Functionality to the My Listing Section

• قابلیت حذف و ویرایش را به بخش فهرست من اضافه کنید Add Delete and Edit Functionality to the My Listing Section

• صفحه EditListing ایجاد کنید Create EditListing Page

• صفحه EditListing ایجاد کنید Create EditListing Page

صفحه فهرست Listing Page

صفحه فهرست Listing Page

• صفحه فهرست ایجاد کنید و از Swiper برای افزودن لغزنده تصویر استفاده کنید Create Listing Page and Use Swiper to Add the Image Slider

• صفحه فهرست ایجاد کنید و از Swiper برای افزودن لغزنده تصویر استفاده کنید Create Listing Page and Use Swiper to Add the Image Slider

• قابلیت اشتراک گذاری کپی را اضافه کنید Add Share Copy Functionality

• قابلیت اشتراک گذاری کپی را اضافه کنید Add Share Copy Functionality

• اطلاعات فهرست را به صفحه فهرست اضافه کنید Add the Listing Information to the Listing Page

• اطلاعات فهرست را به صفحه فهرست اضافه کنید Add the Listing Information to the Listing Page

• مؤلفه تماس با صاحبخانه را ایجاد کنید Create the Landlord Contact Component

• مؤلفه تماس با صاحبخانه را ایجاد کنید Create the Landlord Contact Component

• با استفاده از بسته‌های Leaflet و React-leaflet، نقشه را به صفحه فهرست اضافه کنید Add Map to the Listing Page Using Leaflet and react-leaflet Packages

• با استفاده از بسته‌های Leaflet و React-leaflet، نقشه را به صفحه فهرست اضافه کنید Add Map to the Listing Page Using Leaflet and react-leaflet Packages

صفحه نخست Homepage

صفحه نخست Homepage

• کامپوننت اسلایدر را ایجاد کنید و آن را به صفحه اصلی اضافه کنید Create Slider Component and Add It to the Homepage

• کامپوننت اسلایدر را ایجاد کنید و آن را به صفحه اصلی اضافه کنید Create Slider Component and Add It to the Homepage

• صفحه اصلی را با افزودن پیشنهادات اخیر، مکان‌های اجاره و مکان‌های فروش کامل کنید Complete Homepage By Adding Recent Offers, Places for Rent, and Places for Sale

• صفحه اصلی را با افزودن پیشنهادات اخیر، مکان‌های اجاره و مکان‌های فروش کامل کنید Complete Homepage By Adding Recent Offers, Places for Rent, and Places for Sale

پیشنهادات و صفحات دسته بندی Offers and Category Pages

پیشنهادات و صفحات دسته بندی Offers and Category Pages

• صفحه پیشنهادات را تکمیل کنید Complete the Offers Page

• صفحه پیشنهادات را تکمیل کنید Complete the Offers Page

• صفحات مکان هایی برای اجاره و فروش ایجاد کنید Create the Places for Rent and Sale Pages

• صفحات مکان هایی برای اجاره و فروش ایجاد کنید Create the Places for Rent and Sale Pages

گسترش Deployment

گسترش Deployment

• به Vercel مستقر شوید Deploy to Vercel

• به Vercel مستقر شوید Deploy to Vercel